<?php
	$css_list[0]['url'][] = './tpl/css/general.css';
	$css_list[0]['url'][] = './tpl/css/book.css';
	$js_list[0] = './public/js/jquery.masonry.js';
?>
<!--{template inc/header}-->
<div class="wrapper cate_nav">
	<div class="cn_href">
		<!--{if $is_root}-->
		<a href="{u book/shopping}">{$cate_root['cate_name']}<span class="e_name">/ SHOPPING</span></a>
		<!--{elseif $is_parent_cate}-->
		<a href="{u book/shopping}">{$cate_root['cate_name']}</a>
		<span class="split"></span>
		<a href="{u book/cate cate=$cate_nav_list['cate_code']}">&nbsp;{$cate_nav_list['cate_name']}</a>
		<!--{else}-->
		<a href="{u book/shopping}">{$cate_root['cate_name']}</a>
		<!--{loop $cate_nav_list $cate_nav}-->
		&nbsp;&nbsp;<span class="split"></span>
		<a href="{u book/cate cate=$cate_nav['cate_code']}">&nbsp;{$cate_nav['cate_name']}</a>
		<!--{eval $cate_nav_index++;}-->
		<!--{/loop}-->
		<!--{/if}-->
	</div>
	<ul class="cn_list">
		<!--{loop $book_cates $book_cate}-->
		<!--{if $book_cate['type'] == 'cate'}-->
		<!--{eval $book_cate = $book_cate['data'];}-->
		<li class="cn_item">
			<!--{if !empty($book_cate['cate_icon'])}-->
			<a href="{u book/cate cate=$book_cate['cate_code']}" class="cn_icon"><img src="{$book_cate['cate_icon']}" title="{$book_cate['cate_name']}" ></a>
			<div class="cn_cate">
			<!--{else}-->
			<div class="cn_cate cn_cate1">
			<!--{/if}-->
				<div class="cn_title">
					<a href="{u book/cate cate=$book_cate['cate_code']}"><span>{$book_cate['cate_name']}</span></a>
				</div>
				<p class="cn_tags">
					<!--{loop $book_cate['tags'] $cate_tag}-->
					<!--{if $is_root}-->
					<a href="{u book/shopping tag=$cate_tag['url_tag']}"{if $cate_tag['is_hot'] == 1} class="h"{/if}>{$cate_tag['tag_name']}</a>
					<!--{else}-->
					<a href="{u book/cate cate=$book_cate['cate_code'],tag=$cate_tag['url_tag']}"{if $cate_tag['is_hot'] == 1} class="h"{/if}>{$cate_tag['tag_name']}</a>
					<!--{/if}-->
					<!--{/loop}-->
				</p>
			</div>
		</li>
		<!--{elseif $book_cate['type'] == 'adv'}-->
		<li class="cn_ad">{$book_cate['data']['html']}</li>
		<!--{else}-->
		<li class="cn_item">&nbsp;</li>
		<!--{/if}-->
		<!--{/loop}-->
	</ul>
	<div class="clear"></div>
</div>
<div class="wrapper book_sort">
	<h1>{$title}</h1>
	<div class="bs_sort">
		<strong>排序：</strong>
		<ul>
			<li class="bs_l">
				<?php
					$temp_args = $page_args;
					$temp_args['sort'] = 'hot1';
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				?>
				<a{if $page_args['sort'] == 'hot1'} class="c"{/if} href="{$temp_url}">
					<i></i>
					<span>{lang sort_1hot}</span>
				</a>
			</li>
			<li class="bs_c">
				<?php
					$temp_args['sort'] = 'hot7';
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				?>
				<a{if $page_args['sort'] == 'hot7'} class="c"{/if} href="{$temp_url}">
					<span>{lang sort_7hot}</span>
					<i></i>
				</a>
			</li>
			<li class="bs_r">
				<?php
					$temp_args['sort'] = 'new';
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				?>
				<a{if $page_args['sort'] == 'new'} class="c"{/if} href="{$temp_url}">
					<span>{lang sort_new}</span>
					<i></i>
				</a>
			</li>
		</ul>
		<strong style="margin-left:20px;">价格：</strong>
		<ul>
			<li class="bs_l">
				<?php
					$temp_args = $page_args;
					unset($temp_args['price']);
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				?>
				<a{if !isset($page_args['price'])} class="c"{/if} href="{$temp_url}">
					<i></i>
					<span>全部</span>
				</a>
			</li>
			<li class="bs_c">
				<?php
					$temp_args = $page_args;
					$temp_args['price'] = '0-100';
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				?>
				<a{if $page_args['price'] == '0-100'} class="c"{/if} href="{$temp_url}">
					<span>100元</span>
					<i></i>
				</a>
			</li>
			<li class="bs_c">
				<?php
					$temp_args['price'] = '100-200';
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				?>
				<a{if $page_args['price'] == '100-200'} class="c"{/if} href="{$temp_url}">
					<span>200元</span>
					<i></i>
				</a>
			</li>
			<li class="bs_c">
				<?php
					$temp_args['price'] = '200-500';
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				?>
				<a{if $page_args['price'] == '200-500'} class="c"{/if} href="{$temp_url}">
					<span>500元</span>
					<i></i>
				</a>
			</li>
			<li class="bs_r">
				<?php
					$temp_args['price'] = '500';
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				?>
				<a{if $page_args['price'] == '500'} class="c"{/if} href="{$temp_url}">
					<span>更高</span>
					<i></i>
				</a>
			</li>
		</ul>
		<strong style="margin-left:20px;">颜色：</strong>
		<ul>
			<?php
				$index = 1;
				$count = count($_FANWE['cache']['goods_color']);
				$temp_args = $page_args;
			?>
			<!--{loop $_FANWE['cache']['goods_color'] $color}-->
			<?php
				$class = '';
				if($page_args['color'] == $color['id'])
				{
					unset($temp_args['color']);
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
					$class = ' c';
				}
				else
				{
					$temp_args['color'] = $color['id'];
					$temp_url = FU('book/'.ACTION_NAME,$temp_args);
				}
			?>
			<!--{if $index == 1}-->
			<li class="bs_l">
				<a href="{$temp_url}"><i></i><span><em class="color{$class}" title="{$color['name']}" style="background:{if !empty($color['icon'])}url({getimg $color['icon'] 0 0}){else}{$color['color']}{/if};"><b></b></em></span></a>
			</li>
			<!--{elseif $index == $count}-->
			<li class="bs_r">
				<a href="{$temp_url}"><span><em class="color{$class}" title="{$color['name']}" style="background:{if !empty($color['icon'])}url({getimg $color['icon'] 0 0}){else}{$color['color']}{/if};"><b></b></em></span><i></i></a>
			</li>
			<!--{else}-->
			<li class="bs_c">
				<a href="{$temp_url}"><span><em class="color{$class}" title="{$color['name']}" style="background:{if !empty($color['icon'])}url({getimg $color['icon'] 0 0}){else}{$color['color']}{/if};"><b></b></em></span></a>
			</li>
			<!--{/if}-->
			<!--{eval $index++;}-->
			<!--{/loop}-->
		</ul>
	</div>
</div>
<div class="wrapper book_box">
	<div class="book_list" id="book_list">
		<!--{loop $share_list $share}-->
		<div class="book_item hide1" shareID="{$share['share_id']}" id="share_item_{$share['share_id']}">
			<div class="bi_body">
				<ul class="pic">
					<!--{loop $share['goods_imgs'] $share_img}-->
					<!--{if !isset($page_args['color']) || $page_args['color'] == $share_img['color']}-->
					<li>
						<a style="width:200px;" href="{$share_img['url']}" target="_blank">
							<img class="book_img lazyload" original="{getimg $share_img['img'] 200 999}" width="200" src="./tpl/images/lazyload.gif" oldWidth="{$share_img['img_width']}" oldHeight="{$share_img['img_height']}" alt="{$share_img['alt']}"/>
						</a>
						<!--{if $share_img['commission'] > 0}-->
						<p class="fl">{lang buy_commission} <script type="text/javascript">$.Commission_Format({$share_img['commission']});</script></p>
						<!--{/if}-->
						<p>{$share_img['price_format']}</p>
						<a class="add_to_album_btn" href="javascript:;" style="display:none;" onclick="$.Show_Rel_Album($share_img['id'],'goods');"></a>
					</li>
					<!--{/if}-->
					<!--{/loop}-->
				</ul>
				<div class="content">
					{cutstr $share['content'] 100}
				</div>
				<div class="favorite">
					<a href="javascript:;" class="favaImg" onclick="$.Fav_Share({$share['share_id']},this,32,'#share_item_{$share['share_id']}');"></a>
					<div class="favDiv"><a target="_blank" class="favCount SHARE_FAV_COUNT" href="{$share['url']}"  >$share['collect_count']</a></div>
					<a target="_blank" href="{$share['url']}" class="creply"><b>{$share['comment_count']}</b>评论</a>
				</div>
				<div class="user">
					<!--{getuser $share['uid'] 0 's,30' ',lazyload'}-->
					<p>
						<span class="u"><!--{getuser $share['uid'] 0 '' ''}--></span>
						<span class="t">{$share['time']}</span>
					</p>
				</div>
			</div>
			<div class="bi_foot"></div>
		</div>
		<!--{/loop}-->
	</div>
	<!--{if $pager['page_count'] > 1}-->
	<div style="padding-top:30px" class="clearfix hide" id="pageBox">
		<div class="pagination"> 
			<!--{subtemplate inc/pages}--> 
		</div>
	</div>
	<!--{/if}-->
	<div class="clear"></div>
</div>
<div class="clear"></div>
<div id="pbLoading" style="background:url(./tpl/images/loading.gif) no-repeat center center;height:52px; display:none;"></div>
<div class="hide">
<!--{if $pager['page_count'] > 0}-->
<!--{loop $pb_list $url}-->
<a href="{$url}">{$url}</a>
<!--{/loop}-->
<!--{/if}-->
</div>
<script type="text/javascript">
FANWE.NO_COUNTER = true;
var rowHtml = '<div class="book_item"><div class="bi_body" style="height:#HEIGHT#px;"></div><div class="bi_foot"></div></div>';
var pbUrl = "{$pb_url}";
var imgWidth = 200;
var pbMaxIndex = {$_FANWE['setting']['share_pb_load_count']};

jQuery(function(){
	<!--{dynamic getShareByUserClickShareID}-->
	<!--{dynamic getManageDynamic args=book_index}-->
	
	$(".book_img").each(function(){
		var oldWidth = parseInt(this.getAttribute("oldWidth"));
		var oldHeight = parseInt(this.getAttribute("oldHeight"));
		if(isNaN(oldWidth) || isNaN(oldHeight) || oldWidth == 0 || oldHeight == 0)
		{
			this.height = 0;
		}
		else
		{
			var scale = imgWidth / oldWidth;
			this.height = oldHeight * scale;
		}
	});
	
	$('#book_list').css({"height":"auto","background":"none","overflow":"visible"});
	$('.book_item').css("visibility","visible");
	
	$('#book_list').masonry({
		itemSelector: '.book_item',
		isAnimated:true,
		gutterWidth:18,
		gutterHeight:12,
		columnWidth:226
	});
	<!--{if $pager['page_count'] > 0}-->
	createPBScroll(pbUrl,appendShareItem,pbLoadingFun,2,pbMaxIndex,300);
	<!--{/if}-->
});

function appendBottomItem()
{
	var lefts = new Object();
	var colTotal = 4;
	$(".book_item").each(function(i){
		if($(this).position().top == 0)
		{
			lefts['l'+$(this).position().left] = $(this);
		}
		else
		{
			if(lefts['l'+$(this).position().left].position().top <  $(this).position().top)
				lefts['l'+$(this).position().left] = $(this);
		}
	});
	
	var cols = 0;
	var maxLeft = '';
	var currentSize = 0;
	var maxSize = 0;
	for(var left in lefts)
	{
		cols++;
		currentSize = lefts[left].position().top + lefts[left].height();
		if(currentSize > maxSize)
		{
			maxLeft = left;
			maxSize = currentSize;
		}
	}
	
	var htmlArray = new Array();
	var htmlObjs = new Object();
	html = '';
	for(var left in lefts)
	{
		currentSize = lefts[left].position().top + lefts[left].height();
		if(currentSize < maxSize)
		{
			htmlObjs['h'+(maxSize - currentSize)] = rowHtml.replace("#HEIGHT#",maxSize - currentSize - 20);
			htmlArray.push(maxSize - currentSize);
		}
	}

	var newArray = htmlArray.sort(function(a,b){
		if(a > b)
			return -1;
		else if(a < b)
			return 1;
		else
			return 0;
	});
	
	for(var h=0;h<newArray.length;h++)
	{
		html += htmlObjs['h'+newArray[h]];
	}

	if(colTotal > cols)
	{
		for(var i=0; i< (colTotal - cols);i++)
		{
			html = rowHtml.replace("#HEIGHT#",maxSize - 20) + html;
		}
	}
	html = $('<div>' + html + '</div>').find('.book_item');
	$('#book_list').append(html).masonry('appended',html,true);
}

function appendShareItem(result,index)
{
	html = '<div>' + result + '</div>';
    html = $(html).find('.book_item');
	$(".book_img",html).each(function(){
		var oldWidth = parseInt(this.getAttribute("oldWidth"));
		var oldHeight = parseInt(this.getAttribute("oldHeight"));
		if(isNaN(oldWidth) || isNaN(oldHeight) || oldWidth == 0 || oldHeight == 0)
		{
			this.height = 0;
		}
		else
		{
			var scale = imgWidth / oldWidth;
			this.height = oldHeight * scale;
		}
	});
	$('#book_list').append(html).masonry('appended',html,true,function(){
		$(".BUY_COMMISSION").each(function(){
			$.Commission_Format(this.getAttribute('commission'),this);
			$(this).removeClass("BUY_COMMISSION");
		});
		
		if(index >= pbMaxIndex || result == '')
		{
			$("#pageBox").show();
			var fun = function(){
				appendBottomItem();
			}
			setTimeout(fun,1000);
		}
	});
}

function pbLoadingFun(bln)
{
	if(bln)
		$("#pbLoading").show();
	else
		$("#pbLoading").hide();
}

function ShowUserClickShare(result)
{
	if($("#share_item_" + result.share_id).length > 0)
	{
		var thisshare = $("#share_item_" + result.share_id);
		thisshare.remove();
	}
	
	$('#book_list').prepend(result.html);
	$("#book_list .BUY_COMMISSION").each(function(){
		$.Commission_Format(this.getAttribute('commission'),this);
		$(this).removeClass("BUY_COMMISSION");
	});
}
</script>
<!--{template inc/footer}-->
